/* 主题变量系统 */

@forward "light"; // 亮色主题
@forward "dark"; // 暗色主题
@forward "atomic"; // 基于主题的原子样式
@forward "card"; // 卡片样式
@forward "layout"; // 布局主题

@use "../mixins/namespace" as *;

/*
 * ===============================================================
 * 主题变量系统使用指南
 * ===============================================================
 *
 * 一、核心功能色使用规范
 * ---------------------------------------------------------------
 *
 * 1. 主色系 (Primary)
 *    - 主色: --#{$admin-namespace}-primary
 *    - 悬停色: --#{$admin-namespace}-primary-hover
 *    - 柔和色: --#{$admin-namespace}-primary-muted
 *    - 使用场景:
 *        • 主要按钮 (如保存、提交按钮)
 *        • 导航选中状态
 *        • 关键操作标识
 *        • 品牌强调元素
 *
 * 2. 成功色系 (Success)
 *    - 主色: --#{$admin-namespace}-success
 *    - 悬停色: --#{$admin-namespace}-success-hover
 *    - 柔和色: --#{$admin-namespace}-success-muted
 *    - 使用场景:
 *        • 操作成功提示
 *        • 完成状态标识
 *        • 完成/通过按钮
 *        • 正向进度指示
 *
 * 3. 警告色系 (Warning)
 *    - 主色: --#{$admin-namespace}-warning
 *    - 悬停色: --#{$admin-namespace}-warning-hover
 *    - 柔和色: --#{$admin-namespace}-warning-muted
 *    - 使用场景:
 *        • 警告提示信息
 *        • 即将到期状态
 *        • 待处理操作
 *        • 需要用户注意的元素
 *
 * 4. 危险色系 (Danger)
 *    - 主色: --#{$admin-namespace}-danger
 *    - 悬停色: --#{$admin-namespace}-danger-hover
 *    - 柔和色: --#{$admin-namespace}-danger-muted
 *    - 使用场景:
 *        • 删除/撤销操作按钮
 *        • 严重错误提示
 *        • 关键警报状态
 *        • 危险操作标识
 *
 * 5. 错误色系 (Error)
 *    - 主色: --#{$admin-namespace}-error
 *    - 悬停色: --#{$admin-namespace}-error-hover
 *    - 使用场景:
 *        • 表单验证错误
 *        • 操作失败反馈
 *        • 系统异常状态
 *        • 数据错误指示
 *
 * 6. 次要色系 (Secondary/Info)
 *    - 次要色: --#{$admin-namespace}-secondary
 *    - 信息色: --#{$admin-namespace}-info
 *    - 使用场景:
 *        • 次要操作按钮
 *        • 信息提示框
 *        • 工具提示元素
 *        • 帮助链接
 *
 * 二、背景色系统
 * ---------------------------------------------------------------
 *
 * 1. 全局背景色
 *    - 最底部背景: --#{$admin-namespace}-bg-color-page
 *    - 主内容背景: --#{$admin-namespace}-bg-color
 *
 * 2. 语义背景色
 *    - 主要背景: --#{$admin-namespace}-bg-primary
 *        • 突出内容区背景
 *        • 主色卡片背景
 *    - 次要背景: --#{$admin-namespace}-bg-secondary
 *        • 工具类功能区块
 *        • 支持信息区域
 *    - 成功背景: --#{$admin-namespace}-bg-success
 *        • 成功状态内容区
 *        • 已完成流程区域
 *    - 信息背景: --#{$admin-namespace}-bg-info
 *        • 帮助文档区域
 *        • 说明性内容背景
 *    - 警告背景: --#{$admin-namespace}-bg-warning
 *        • 待处理状态区域
 *        • 警告提示背景
 *    - 危险背景: --#{$admin-namespace}-bg-danger
 *        • 错误信息区域
 *        • 警报内容背景
 *
 * 三、文本颜色层级系统
 * ---------------------------------------------------------------
 *
 * 1. 重要内容
 *    - 一级标题/核心文本: --#{$admin-namespace}-text-gray-900
 *    - 二级标题/关键文本: --#{$admin-namespace}-text-gray-800
 *
 * 2. 主体内容
 *    - 正文内容: --#{$admin-namespace}-text-gray-700
 *    - 补充说明: --#{$admin-namespace}-text-gray-600
 *
 * 3. 辅助内容
 *    - 表单占位符/标签: --#{$admin-namespace}-text-gray-500
 *    - 禁用状态文本: --#{$admin-namespace}-text-gray-400
 *    - 次要说明文本: --#{$admin-namespace}-text-muted
 *
 * 4. 深色背景文本
 *    - 主内容反色: --#{$admin-namespace}-text-gray-300
 *    - 辅助反色文本: --#{$admin-namespace}-text-gray-200
 *    - 弱反色文本: --#{$admin-namespace}-text-gray-100
 *
 * 四、界面元素规范
 * ---------------------------------------------------------------
 *
 * 1. 边框系统
 *    - 常规边框: --#{$admin-namespace}-border-color
 *        • 卡片边框
 *        • 输入框边框
 *        • 功能区划分
 *    - 虚线边框: --#{$admin-namespace}-border-dashed-color
 *        • 拖放区域
 *        • 分界线
 *        • 待完成状态标识
 *
 * 2. 阴影系统
 *    - 微小阴影 (XS): --#{$admin-namespace}-box-shadow-xs
 *        • 悬浮按钮
 *        • 轻量级弹出层
 *    - 小阴影 (SM): --#{$admin-namespace}-box-shadow-sm
 *        • 卡片悬浮效果
 *        • 下拉菜单
 *    - 常规阴影: --#{$admin-namespace}-box-shadow
 *        • 模态弹窗
 *        • 卡片堆叠效果
 *    - 大阴影 (LG): --#{$admin-namespace}-box-shadow-lg
 *        • 重要通知
 *        • 顶部导航栏
 *
 * 3. 卡片系统
 *    - 卡片基础阴影: --#{$admin-namespace}-root-card-box-shadow
 *    - 卡片边框色: --#{$admin-namespace}-root-card-border-color
 *
 * 五、使用原则
 * ---------------------------------------------------------------
 *
 * 1. 一致性原则:
 *    在整个系统中，相同语义状态的元素使用相同颜色变量
 *
 * 2. 层次性原则:
 *    - 内容重要性决定文本深浅 (900 > 800 > 700)
 *    - 操作重要性决定按钮颜色 (主色 > 次要色 > 文字按钮)
 *
 * 3. 对比度保障:
 *    所有文本与背景组合遵循WCAG标准，保证AA级可访问性
 *
 * 4. 悬停反馈:
 *    所有交互元素必须使用*-hover变量提供视觉反馈
 *
 * 5. 禁用状态:
 *    使用--text-gray-500文本色 + --gray-200背景色组合
 *
 * 六、特殊场景
 * ---------------------------------------------------------------
 *
 * 1. 禁用状态:
 *    - 文本: --#{$admin-namespace}-text-gray-500
 *    - 背景: --#{$admin-namespace}-gray-200
 *
 * 2. 黑暗模式:
 *    系统已内置完整的暗黑主题，通过切换`.dark`类实现
 *
 * 3. 透明效果:
 *    使用RGB变量 (如rgba(var(--primary-rgb), 0.8))
 *    创建半透明元素
 */
